<template>
	<view class="h-fill">
		<u-navbar title="我的钱包" :background="{backgroundImage: 'linear-gradient(to right, #434AD8, #8E77F5)'}" :borderBottom="false" titleColor="#fff" backIconColor="#fff"></u-navbar>
		<view class="content uni-flex uni-column align-center">
			<image class="content-icon" src="./static/img/ic_qianbao.png" mode="aspectFit"></image>
			<text class="t-mg-2">我的账户余额</text>
			<text class="content-money uni-bold">￥ {{balance}}</text>
			<view class="uni-flex align-center t-mg-2" @click="navToDetail">
				<image class="content-detail-icon" src="./static/img/ic_shouzhi.png"></image>
				<text style="color: rgb(255, 157, 0);">收支明细</text>
				<uni-icons type="forward" color="rgb(255, 157, 0)"></uni-icons>
			</view>
			<!-- <view @click="navToWithdraw" class="content-btn">
				<image :src="$getCloudStorageUrl('/img_anniu.png')" mode="aspectFit"></image>
				<text>提现</text>
			</view> -->
			<view style="margin-top: 120rpx;">
				<nice-red-button @click="navToWithdraw" text="提现"></nice-red-button>
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	import {requestSubscribeMsg} from "../common/maUtil.js"
	export default {
		data() {
			return {
				userInfo: {},
				
				form: {
					amount: "0"
				},
				rules: {
					amount: [
						{ 
							required: true, 
							message: '请输入金额', 
							trigger: ['change','blur'],
						}
					],
				},
				busy: false
			};
		},
		computed: {
			balance() {
				if (this.userInfo && this.userInfo.blance) {
					return this.userInfo.blance.toFixed(2);
				} else {
					return "0.00";
				}
			}
		},
		onShow() {
			this.loadData();
		},
		async onPullDownRefresh() {
			await this.loadData();
			uni.stopPullDownRefresh();
		},
		methods:{
			async loadData() {
				this.busy = true;
				try{
					// this.userInfo = await this.$http.getUserDetail();
					this.busy = false;
				}catch(e){
					this.busy = false;
					this.$log("获取会员信息遇到错误", e);
				}
			},
			navToDetail() {
				uni.navigateTo({
					url: "./wallet-detail"
				})
			},
			navToWithdraw() {
				uni.navigateTo({
					url: "./withdraw"
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}
	
	.content {
		// background-color: #007AFF;
		padding-top: 160rpx;
		height: 100vh;
		&-icon {
			width: 200rpx;
			height: 200rpx;
		}
		&-money {
			font-size: 38rpx;
		}
		&-detail-icon {
			width: 40rpx;
			height: 40rpx;
			margin-right: 8rpx;
		}
	}
</style>
